<script setup>

</script>
<template>
  <view class="topBar-wraper">
    <view class="topBar">当前配送至</view>
    <view class="location-box">
      <view class="icon"></view>
      <view class="address_text">襄阳市 襄城区 隆中街道</view>
    </view>
    <view class="topBar">从我的收货地址选择</view>
  </view>
  <view class="location_content">
    <view class="location_item">
      <view class="location_top">
        <view class="name">小陆同学</view>
        <view class="number">1916452425</view>
      </view>
      <view class="location_bottom"><text class="default_address">[默认地址]</text>湖北省襄阳市襄城区 隆中街道隆中路18号襄阳职业
技术学院主校区</view>
    </view>
    <view class="location_item">
      <view class="location_top">
        <view class="name">小陆同学</view>
        <view class="number">1916452425</view>
      </view>
      <view class="location_bottom">湖北省襄阳市襄城区 隆中街道隆中路18号襄阳职业
技术学院主校区</view>
    </view>
    <view class="location_item">
      <view class="location_top">
        <view class="name">小陆同学</view>
        <view class="number">1916452425</view>
      </view>
      <view class="location_bottom">湖北省襄阳市襄城区 隆中街道隆中路18号襄阳职业
技术学院主校区</view>
    </view>
    <view class="location_item">
      <view class="location_top">
        <view class="name">小陆同学</view>
        <view class="number">1916452425</view>
      </view>
      <view class="location_bottom">湖北省襄阳市襄城区 隆中街道隆中路18号襄阳职业
技术学院主校区</view>
    </view>
    <view class="location_item">
      <view class="location_top">
        <view class="name">小陆同学</view>
        <view class="number">1916452425</view>
      </view>
      <view class="location_bottom">湖北省襄阳市襄城区 隆中街道隆中路18号襄阳职业
技术学院主校区</view>
    </view>
  </view>
  
</template>

<style lang="scss">
.topBar {
  width: 100%;
  height: 70rpx;
  background-color: #ecebeb;
  font-size: 27rpx;
  line-height: 70rpx;
  padding-left: 10rpx;
  box-sizing: border-box;
  color: #979696;
}
.location-box {
  display: flex;
  align-items: center;
  width: 100%;
  height: 80rpx;
  background-color: #fff;
  .icon {
    width: 40rpx;
    height: 40rpx;
    background:url('../../../src/static/images/location.png') no-repeat;
    background-size: cover;
    margin-right: 20rpx;
    
  }
  .address_text {
    font-size: 30rpx;
  }
}

.location_content {
  .location_item {
    width: 100%;
    // height: 150rpx;
    padding-bottom: 30rpx;
    box-sizing: border-box;
    // background-color: pink;
    border-bottom: 1px solid #dcdbdb;
    .location_top {
      .name {
        font-size: 30rpx;
      }
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0rpx 15rpx;
      box-sizing: border-box;
      font-size: 27rpx;
      width: 100%;
      height: 70rpx;
      // background-color: blue;
    }
    .location_bottom {
      font-size: 25rpx;
      letter-spacing: 6rpx;
      padding: 0rpx 10rpx;
      .default_address {
        color: red;
      }
    }
  }
}
</style>